*{ -webkit-box-sizing:border-box; 
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	padding:0; margin:0;
}
html{ -ms-touch-action:none; width: 100%;height: 100%;}
body, ul, li{ padding:0; margin:0; border:0; }
body{ 
	width: 100%;
	height: 100%;
	font-size:12px;
	font-family:ubuntu, helvetica, arial; 
	overflow:hidden; /* this is important to prevent the whole page to bounce */; 
}
a{ text-decoration:none; }
:active{ -webkit-tap-highlight-color:rgba(255, 255, 255, 0); }/*改变元素被点击时背景框的颜色*/

#loading{
	width: 100%;
	position: absolute;
	z-index: 10;
	top: 0;
	bottom: 0;
	background: #f6f6f6;
}
.loading_title{
	width: 100%;
	position: absolute;
	bottom: 10px;
	line-height: 3;
	text-align: center;
}
.wrapper{
	position:absolute;
	z-index:1;
	top:0px;
	bottom:0px;
	left:0;
	width:100%;
	overflow:hidden;
	background:#fff9f2 url(../images/welcome/bg.png) 0 0 / 100% 100% repeat-x; 
}
.scroller{
	height:100%;
	position:absolute;
	z-index:1;
 }

.home{
	-webkit-transform-origin:0 0;/*设置旋转元素的基点位置*/
	width:820px;
	position:relative;
	z-index:1;
	height:100%;
}
.ico{ 
	background-size:contain;/*把图像图像扩展至最大尺寸，以使其宽度和高度完全适应内容区域。*/
	background-repeat:no-repeat;
}
.home .ico{ position:absolute; }
.home_light1{
	background-image:url(../images/welcome/left_light.png);
	width:77px;
	height:345px;
	top:40px;
	left:59px;
	-webkit-animation:home_light 3600ms linear 0s infinite;
	-moz-animation:home_light 3600ms linear 0s infinite;
	-ms-animation:home_light 3600ms linear 0s infinite;
	animation:home_light 3600ms linear 0s infinite;
}
.home_art1{
	background-image: url(../images/welcome/left_art.png);
	width: 250px;
	height: 190px;
	top: 247px;
	left: 45px;
	-webkit-animation:home_art 3600ms linear 0s infinite;
	-moz-animation:home_art 3600ms linear 0s infinite;
	-ms-animation:home_art 3600ms linear 0s infinite;
	animation:home_art 3600ms linear 0s infinite;
}
.home_light2{ 
	background-image:url(../images/welcome/right_light.png);
	width:79px;
	height:345px;
	top:40px;
	left:660px;
	-webkit-animation:home_light 3600ms linear 0s infinite;
	-moz-animation:home_light 3600ms linear 0s infinite;
	-ms-animation:home_light 3600ms linear 0s infinite;
	animation:home_light 3600ms linear 0s infinite;
}
.home_art2{
	background-image: url(../images/welcome/right_art.png);
	width: 218px;
	height: 220px;
	top: 225px;
	left: 590px;
	-webkit-animation:home_art 3600ms linear 0s infinite;
	-moz-animation:home_art 3600ms linear 0s infinite;
	-ms-animation:home_art 3600ms linear 0s infinite;
	animation:home_art 3600ms linear 0s infinite;
}
.entry_logo{
	background-image: url(../images/welcome/entry_logo.png);
	width: 110px;
	height: 64px;
	top: 390px;
	left: 365px;
	padding-top: 66px;
	text-align: center;
	-webkit-animation:home_entry 1800ms linear 0s infinite;
	-moz-animation:home_entry 1800ms linear 0s infinite;
	-ms-animation:home_entry 1800ms linear 0s infinite;
	animation:home_entry 1800ms linear 0s infinite;
}
.home_eye{
	background-image: url(../images/welcome/eye.gif);
	width: 69px;
	height: 42px;
	top: 310px;
	left: 466px;
	z-index: 3;
}
.home_home{
	background-image: url(../images/welcome/home.png);
	width: 375px;
	height: 210px;
	top: 141px;
	left: 215px;
	z-index: 2;
}
.home_sun{
	background-image: url(../images/welcome/home_sun.png);
	width: 85px;
	height: 85px;
	top: 110px;
	left: 265px;
	z-index: 1;
	-webkit-animation:home_sun 3600ms linear 0s infinite;
	-moz-animation:home_sun 3600ms linear 0s infinite;
	-ms-animation:home_sun 3600ms linear 0s infinite;
	animation:home_sun 3600ms linear 0s infinite;
}
.home_fly1{
	background-image: url(../images/welcome/1.png);
	width: 39px;
	height: 34px;
	top: 105px;
	left: 85px;
	-webkit-animation:cloud1 7200ms linear 0s infinite;
	-moz-animation:cloud1 7200ms linear 0s infinite;
	-ms-animation:cloud1 7200ms linear 0s infinite;
	animation:cloud1 7200ms linear 0s infinite;
}
.home_fly2{
	background-image: url(../images/welcome/2.png);
	width: 52px;
	height: 51px;
	top: 25px;
	left: 233px;
	-webkit-animation:cloud1 12200ms linear 0s infinite;
	-moz-animation:cloud1 12200ms linear 0s infinite;
	-ms-animation:cloud1 12200ms linear 0s infinite;
	animation:cloud1 12200ms linear 0s infinite;
}
.home_fly3{
	background-image: url(../images/welcome/3.png);
	width: 22px;
	height: 25px;
	top: 45px;
	left: 430px;
	-webkit-animation:cloud2 12000ms linear 0s infinite;
	-moz-animation:cloud2 12000ms linear 0s infinite;
	--ms-animation:cloud2 12000ms linear 0s infinite;
	animation:cloud2 12000ms linear 0s infinite;
}
.home_fly4{
	background-image: url(../images/welcome/4.png);
	width: 73px;
	height: 42px;
	top: 83px;
	left: 570px;
	-webkit-animation:cloud3 12200ms linear 0s infinite;
	-moz-animation:cloud3 12200ms linear 0s infinite;
	-ms-animation:cloud3 12200ms linear 0s infinite;
	animation:cloud3 12200ms linear 0s infinite;
}
.home_fly5{
	background-image: url(../images/welcome/4.png);
	width: 22px;
	height: 25px;
	top: 37px;
	left: 730px;
	-webkit-animation:cloud3 13200ms linear 0s infinite;
	-moz-animation:cloud3 13200ms linear 0s infinite;;
	-ms-animation:cloud3 13200ms linear 0s infinite;;
	animation:cloud3 13200ms linear 0s infinite;
}


/*规定动画效果*/

@keyframes home_light
{
	0%{
		-webkit-transform:translateY(-10px);
		transform:translateY(-10px);
	}
	50%{
		-webkit-transform:translateY(10px);
		transform:translateY(10px);
	}
	100%{
		-webkit-transform:translateY(-10px);
		transform:translateY(-10px);
	}
}
@-moz-keyframes home_light
{
	0%{
		-webkit-transform:translateY(-10px);
		transform:translateY(-10px);
	}
	50%{
		-webkit-transform:translateY(10px);
		transform:translateY(10px);
	}
	100%{
		-webkit-transform:translateY(-10px);
		transform:translateY(-10px);
	}
}
@-ms-keyframes home_light
{
	0%{
		-webkit-transform:translateY(-10px);
		transform:translateY(-10px);
	}
	50%{
		-webkit-transform:translateY(10px);
		transform:translateY(10px);
	}
	100%{
		-webkit-transform:translateY(-10px);
		transform:translateY(-10px);
	}
}

@-webkit-keyframes home_light /*Safari and Chrome*/
{
	0%{
		-webkit-transform:translateY(-10px);
		transform:translateY(-10px);
	}
	50%{
		-webkit-transform:translateY(10px);
		transform:translateY(10px);
	}
	100%{
		-webkit-transform:translateY(-10px);
		transform:translateY(-10px);
	}
}
/*--------art-------*/
@keyframes home_art
{
	0%{
		-webkit-transform:translateX(-10px);
		transform:translateX(-10px);
	}
	50%{
		-webkit-transform:translateX(10px);
		transform:translateX(10px);
	}
	100%{
		-webkit-transform:translateX(-10px);
		transform:translateX(-10px);
	}
}
@-moz-keyframes home_art
{
	0%{
		-webkit-transform:translateX(-10px);
		transform:translateX(-10px);
	}
	50%{
		-webkit-transform:translateX(10px);
		transform:translateX(10px);
	}
	100%{
		-webkit-transform:translateX(-10px);
		transform:translateX(-10px);
	}
}
@-ms-keyframes home_art
{
	0%{
		-webkit-transform:translateX(-10px);
		transform:translateX(-10px);
	}
	50%{
		-webkit-transform:translateX(10px);
		transform:translateX(10px);
	}
	100%{
		-webkit-transform:translateX(-10px);
		transform:translateX(-10px);
	}
}

@-webkit-keyframes home_art /*Safari and Chrome*/
{
	0%{
		-webkit-transform:translateX(-10px);
		transform:translateX(-10px);
	}
	50%{
		-webkit-transform:translateX(10px);
		transform:translateX(10px);
	}
	100%{
		-webkit-transform:translateX(-10px);
		transform:translateX(-10px);
	}
}

/*------entry------*/
@keyframes home_entry
{
	0%{
		transform:translateY(10px);
		opacity:0;
	}

	100%{
		transform:translateY(-10px);
		opacity:1;
	}
}

@-moz-keyframes home_entry
{
	0%{
		-moz-transform:translateY(10px);
		opacity:0;
	}

	100%{
		-moz-transform:translateY(-10px);
		opacity:1;	
	}
}
@-ms-keyframes home_entry
{
	0%{
		-ms-transform:translateY(10px);
		opacity:0;
	}

	100%{
		-ms-transform:translateY(-10px);
		opacity:1;
	}
}
@-webkit-keyframes home_entry /*Safari and Chrome*/
{
	0%{
		-webkit-transform:translateY(10px);
		opacity:0.3;
	}
	100%{
		-webkit-transform:translateY(-10px);
		opacity:1;
	}
}

/*------sun-逆时针转-----*/
@keyframes home_sun
{
	0%{ 
		transform:rotate(0deg); 
	}
	100%{ 
		transform:rotate(-360deg); 
	}
}
@-moz-keyframes home_sun /*Safari and Chrome*/
{
	0%{ 
		-moz-transform:rotate(0deg);
	}
	100%{ 
		-moz-transform:rotate(-360deg);
	}
}
@-ms-keyframes home_sun /*Safari and Chrome*/
{
	0%{ 
		-ms-transform:rotate(0deg);
	}
	100%{ 
		-ms-transform:rotate(-360deg);
	}
}
@-webkit-keyframes home_sun /*Safari and Chrome*/
{
	0%{ 
		-webkit-transform:rotate(0deg);
	}
	100%{ 
		-webkit-transform:rotate(-360deg);
	}
}
/* 逆时针转*/
@keyframes home_sun1
{
	0%{ 
		transform:rotate(0deg); 
	}
	100%{ 
		transform:rotate(360deg); 
	}
}
@-moz-keyframes home_sun1 /*Safari and Chrome*/
{
	0%{ 
		-moz-transform:rotate(0deg);
	}
	100%{ 
		-moz-transform:rotate(360deg);
	}
}
@-ms-keyframes home_sun1 /*Safari and Chrome*/
{
	0%{ 
		-ms-transform:rotate(0deg);
	}
	100%{ 
		-ms-transform:rotate(360deg);
	}
}
@-webkit-keyframes home_sun1 /*Safari and Chrome*/
{
	0%{ 
		-webkit-transform:rotate(0deg);
	}
	100%{ 
		-webkit-transform:rotate(360deg);
	}
}

@-webkit-keyframes cloud1{
	0%{
		-webkit-transform:translateX(-100px) rotate(360deg);
	}
	50%{
		-webkit-transform:translateX(500px) rotate(0deg);
	}
	100%{
		-webkit-transform:translateX(-100px) rotate(-360deg);
	}
}
@-moz-keyframes cloud1{
	0%{
		-moz-transform:translateX(-100px) rotate(360deg);
	}
	50%{
		-moz-transform:translateX(500px) rotate(0deg);
	}
	100%{
		-moz-transform:translateX(-100px) rotate(-360deg);
	}
}
@-ms-keyframes cloud1{
	0%{
		-ms-transform:translateX(-100px) rotate(360deg);
	}
	50%{
		-ms-transform:translateX(500px) rotate(0deg);
	}
	100%{
		-ms-transform:translateX(-100px) rotate(-360deg);
	}
}
@keyframes cloud1{
	0%{
		transform:translateX(-100px) rotate(360deg);
	}
	50%{
		transform:translateX(500px) rotate(0deg);
	}
	100%{
		transform:translateX(-100px) rotate(-360deg);
	}
}

@-webkit-keyframes cloud2{
	0%{
		-webkit-transform:translateX(0px) rotate(0deg);
	}
	25%{
		-webkit-transform:translateX(350px) rotate(360deg);
	}
	50%{
		-webkit-transform:translateX(0px) rotate(720deg);
	}
	75%{
		-webkit-transform:translateX(-350px) rotate(1080deg);
	}
	100%{
		-webkit-transform:translateX(0px) rotate(1440deg);
	}
}
@-moz-keyframes cloud2{
	0%{
		-moz-transform:translateX(0px) rotate(0deg);
	}
	25%{
		-moz-transform:translateX(350px) rotate(360deg);
	}
	50%{
		-moz-transform:translateX(0px) rotate(720deg);
	}
	75%{
		-moz-transform:translateX(-350px) rotate(1080deg);
	}
	100%{
		-moz-transform:translateX(0px) rotate(1440deg);
	}
}
@-ms-keyframes cloud2{
	0%{
		-ms-transform:translateX(0px) rotate(0deg);
	}
	25%{
		-ms-transform:translateX(350px) rotate(360deg);
	}
	50%{
		-ms-transform:translateX(0px) rotate(720deg);
	}
	75%{
		-ms-transform:translateX(-350px) rotate(1080deg);
	}
	100%{
		-ms-transform:translateX(0px) rotate(1440deg);
	}
}
@keyframes cloud2{
	0%{
		transform:translateX(0px) rotate(0deg);
	}
	25%{
		transform:translateX(350px) rotate(360deg);
	}
	50%{
		transform:translateX(0px) rotate(720deg);
	}
	75%{
		transform:translateX(-350px) rotate(1080deg);
	}
	100%{
		transform:translateX(0px) rotate(1440deg);
	}
}

@-webkit-keyframes cloud3{
	0%{
		-webkit-transform:translateX(0px) rotate(360deg);
	}
	50%{
		-webkit-transform:translateX(-600px) rotate(0deg);
	}
	100%{
		-webkit-transform:translateX(0px) rotate(-360deg);
	}
}
@-moz-keyframes cloud3{
	0%{
		-moz-transform:translateX(0px) rotate(360deg);
	}
	50%{
		-moz-transform:translateX(-600px) rotate(0deg);
	}
	100%{
		-moz-transform:translateX(0px) rotate(-360deg);
	}
}
@-ms-keyframes cloud3{
	0%{
		-ms-transform:translateX(0px) rotate(360deg);
	}
	50%{
		-ms-transform:translateX(-600px) rotate(0deg);
	}
	100%{
		-ms-transform:translateX(0px) rotate(-360deg);
	}
}
@keyframes cloud3{
	0%{
		transform:translateX(0px) rotate(360deg);
	}
	50%{
		transform:translateX(-600px) rotate(0deg);
	}
	100%{
		transform:translateX(0px) rotate(-360deg);
	}
}

@-webkit-keyframes section1_ball /*Safari and Chrome*/
{
	0%{
		-webkit-transform:translateY(100px) rotate(360deg);
	}
	50%{
		-webkit-transform:translateY(-5px) rotate(0deg);	
	}
	100%{
		-webkit-transform:translateY(100px) rotate(-360deg);
	}
}
@-moz-keyframes section1_ball /*Safari and Chrome*/
{
	0%{
		-moz-transform:translateY(100px) rotate(360deg);
	}
	50%{
		-moz-transform:translateY(-5px) rotate(0deg);
	}
	100%{
		-moz-transform:translateY(100px) rotate(-360deg);
	}
}
@-ms-keyframes section1_ball /*Safari and Chrome*/
{
	0%{
		-ms-transform:translateY(100px) rotate(360deg);
	}
	50%{
		-ms-transform:translateY(-5px) rotate(0deg);
	}
	100%{
		-ms-transform:translateY(100px) rotate(-360deg);
	}
}
@keyframes section1_ball 
{
	0%{
		transform:translateY(100px) rotate(360deg);
	}
	50%{
		transform:translateY(-5px) rotate(0deg);
	}
	100%{
		transform:translateY(100px) rotate(-360deg);
	}
}

/*---artshow-animation*/
@-webkit-keyframes hand1{
	0%{
		-webkit-transform:translateX(0);
		opacity: 1;
	}
	100%{
		-webkit-transform:translateX(-50px);
		opacity: .2;
	}
}
@-moz-keyframes hand1{
	0%{
		-moz-transform:translateX(0);
		opacity: 1;
	}
	100%{
		-moz-transform:translateX(-50px);
		opacity: .2;
	}
}
@-ms-keyframes hand1{
	0%{
		-ms-transform:translateX(0);
		opacity: 1;
	}
	100%{
		-ms-transform:translateX(-50px);
		opacity: .2;
	}
}
@keyframes hand1{
	0%{
		transform:translateX(0);
		opacity: 1;
	}
	100%{
		transform:translateX(-50px);
		opacity: .2;
	}
}

@-webkit-keyframes opacity1{
	0%{
		opacity: 1;
	}
	50%{
		opacity: .2;
	}
	100%{
		opacity: 1;
	}
}
@-moz-keyframes opacity1{
	0%{
		opacity: 1;
	}
	50%{
		opacity: .2;
	}
	100%{
		opacity: 1;
	}
}
@-ms-keyframes opacity1{
	0%{
		opacity: 1;
	}
	50%{
		opacity: .2;
	}
	100%{
		opacity: 1;
	}
}
@keyframes opacity1{
	0%{
		opacity: 1;
	}
	50%{
		opacity: .2;
	}
	100%{
		opacity: 1;
	}
}

@-webkit-keyframes section1_geometry1{
	0%{
		-webkit-transform:translateY(15px);
	}
	70%{
		-webkit-transform:translateY(-15px);
	}
	100%{
		-webkit-transform:translateY(15px);
	}
}
@-moz-keyframes section1_geometry1{
	0%{
		-moz-transform:translateY(15px);
	}
	70%{
		-moz-transform:translateY(-15px);
	}
	100%{
		-moz-transform:translateY(15px);
	}
}
@-ms-keyframes section1_geometry1{
	0%{
		-ms-transform:translateY(15px);
	}
	70%{
		-ms-transform:translateY(-15px);
	}
	100%{
		-ms-transform:translateY(15px);
	}
}
@keyframes section1_geometry1{
	0%{
		transform:translateY(15px);
	}
	70%{
		transform:translateY(-15px);
	}
	100%{
		transform:translateY(15px);
	}
}

@-webkit-keyframes section1_geometry2{
	0%{
		-webkit-transform:translateX(10px);
	}
	70%{
		-webkit-transform:translateX(-17px);
	}
	100%{
		-webkit-transform:translateX(10px);
	}
}
@-moz-keyframes section1_geometry2{
	0%{
		-moz-transform:translateX(10px);
	}
	70%{
		-moz-transform:translateX(-17px);
	}
	100%{
		-moz-transform:translateX(10px);
	}
}
@-ms-keyframes section1_geometry2{
	0%{
		-ms-transform:translateX(10px);
	}
	70%{
		-ms-transform:translateX(-17px);
	}
	100%{
		-ms-transform:translateX(10px);
	}
}
@keyframes section1_geometry2{
	0%{
		transform:translateX(10px);
	}
	70%{
		transform:translateX(-17px);
	}
	100%{
		transform:translateX(10px);
	}
}

@-webkit-keyframes copy_button
{
	0%{
		-webkit-transform:translateY(-5px);
		opacity:1;
	}
	70%{
		-webkit-transform:translateY(3px);
		opacity:1;
	}
	100%{
		-webkit-transform:translateY(5px);
		opacity:.2;
	}
}
@-moz-keyframes copy_button
{
	0%{
		-moz-transform:translateY(-5px);
		opacity:1;
	}
	70%{
		-moz-transform:translateY(3px);
		opacity:1;
	}
	100%{
		-moz-transform:translateY(5px);
		opacity:.2;
	}
}
@-ms-keyframes copy_button
{
	0%{
		-ms-transform:translateY(-5px);
		opacity:1;
	}
	70%{
		-ms-transform:translateY(3px);
		opacity:1;
	}
	100%{
		-ms-transform:translateY(5px);
		opacity:.2;
	}
}
@keyframes copy_button
{
	0%{
		transform:translateY(-5px);
		opacity:1;
	}
	70%{
		transform:translateY(3px);
		opacity:1;
	}
	100%{
		transform:translateY(5px);
		opacity:.2;
	}
}

/*-----artshow-----*/

.artwrapper{
	display: none;
	position:absolute;
	z-index:1;
	top:0px;
	bottom:0px;
	left:0;
	width:100%;
	overflow:hidden;
	background:#fff9f2 url(../images/artshow/artbg.png) 0 0 / 100% 100% repeat-x; 
}
.container{
	-webkit-transform-origin:0 0;/*设置旋转元素的基点位置*/
	width:3790px;
	position:relative;
	z-index:1;
	height: 100%;
}

.section{ 
	/*简介区*/
	position:absolute;
	left:0;
	top:0;
}
.section1{ 
	/*图片展示区*/
	position:absolute;
	left:640px;
	top:0;
}
.section2{
	position:absolute;
	left: 1030px;
	top:0;
}
.section3{
	position:absolute;
	left: 1830px;
	top:0;
}

.pipe{ 
	background-image:url(../images/artshow/pipe.png);
	width:502px;
	height:127px;
	position:absolute;
	left:0;
	top:15px;
}

.title_box{
	width:640px;
	height:315px;
	position:absolute;
	background-color:#f6f7f7;
	top:105px;
	left:0;
}


.ex_title{
	background-image:url(../images/artshow/ex_title.png);
	width:203px;
	height:227px;
	position:absolute;
	top:50px;
	left:65px;
}

.ico_hand{
	background-image:url(../images/artshow/hand1.png);
	width: 62px;
	height: 91px;
	position:absolute;
	left: 160px;
	top: 410px;
	-webkit-animation: hand1 1800ms linear 0s infinite;
	-moz-animation:hand1 1800ms linear 0s infinite;
	-ms-animation:hand1 1800ms linear 0s infinite;
	animation:hand1 1800ms linear 0s infinite;
}

.ex_text{
	background-color:#fff;
	position:absolute;
	left: 260px;
    top: -30px;
	font-size:12px;
	text-indent:2em;
	width:288px;
	height:283px;
	padding:10px;
	line-height:16px;
}

/*--section1*/
.section1_title{
	width: 120px;
	height: 25px;
	border: 1px solid #fff;
	position:absolute;
	left:10px;
	top:55px;
	color: #fff;
	line-height: 18px;
	text-align: center;
	z-index: 4;
}

.title_border{
	width: 120px;
	height: 25px;
	border: 1px solid #fff;
	position:absolute;
	left:-5px;
	top:-5px;
	padding: 10px;
	z-index: 2;
}

.ball_start{
	background-image:url(../images/artshow/ball_start.png);
	width: 273px;
	height: 232px;
	position:absolute;
	left: 100px;
	top: 14px;
	-webkit-animation:opacity1 4000ms linear 0s infinite;
	-moz-animation:opacity1 4000ms linear 0s infinite;
	-ms-animation:opacity1 4000ms linear 0s infinite;
	animation:opacity1 4000ms linear 0s infinite;
}

.ball_line{
	background-image:url(../images/artshow/ball_line.png);
	width: 78px;
	height: 255px;
	position:absolute;
	left:170px;
	top:50px;
}

.ball{ 
	background-image:url(../images/artshow/ball.png);
	width:64px;
	height:64px;
	position:absolute;
	left:6.5px;
	top:10px;
	-webkit-animation:section1_ball 7200ms linear 0s infinite;
	-moz-animation:section1_ball 7200ms linear 0s infinite;
	-ms-animation:section1_ball 7200ms linear 0s infinite;
	animation:section1_ball 7200ms linear 0s infinite;
}

.pic_show1{
	background-image:url(../images/artshow/section1_pic.png);
	width: 286px;
    height: 316px;
    position: absolute;
    left: 0;
    top: 105px;
}

.copy1{
	background-image:url(../images/artshow/copy.png);
	width: 12px;
    height: 9px;
    position: absolute;
    left: 50px;
    top: 70px;
    -webkit-animation:copy_button 1800ms linear 0s infinite;
    -moz-animation:copy_button 1800ms linear 0s infinite;
    -ms-animation:copy_button 1800ms linear 0s infinite;
    animation:copy_button 1800ms linear 0s infinite;
}
.copy2{
	background-image:url(../images/artshow/copy.png);
	width: 12px;
    height: 9px;
    position: absolute;
    left: 190px;
    top: 90px;
    -webkit-animation:copy_button 1800ms linear 0s infinite;
    -moz-animation:copy_button 1800ms linear 0s infinite;
    -ms-animation:copy_button 1800ms linear 0s infinite;
    animation:copy_button 1800ms linear 0s infinite;
}

.pic{ 
	background-size:contain;/*把图像图像扩展至最大尺寸，以使其宽度和高度完全适应内容区域。*/
	background-repeat:no-repeat;
	z-index: 5;
}

.pic1{
	background-image:url(../images/artshow/img_pic_1.png);
	width: 85px;
    height: 174px;
    position: absolute;
    left: 10px;
    top: 75px;
}

.pic2{
	background-image:url(../images/artshow/img_pic_2.png);
	width: 94px;
    height: 116px;
    position: absolute;
    left: 148px;
    top: 110px;
}

.geometry1{
	background-image:url(../images/artshow/sectiol1_geometry1.png);
	width: 73px;
    height: 252px;
    position: absolute;
    left: 294px;
    top: 160px;
    -webkit-animation:section1_geometry1 2600ms linear 0s infinite;
    -moz-animation:section1_geometry1 2600ms linear 0s infinite;
    -ms-animation:section1_geometry1 2600ms linear 0s infinite;
    animation:section1_geometry1 2600ms linear 0s infinite;
}

.geometry2{
	background-image:url(../images/artshow/section1_geometry2.png);
	width: 86px;
    height: 85px;
    position: absolute;
    left: 303px;
    top: 360px;
    -webkit-animation:section1_geometry2 2600ms linear 0s infinite;
    -moz-animation:section1_geometry2 2600ms linear 0s infinite;
    -ms-animation:section1_geometry2 2600ms linear 0s infinite;
    animation:section1_geometry2 2600ms linear 0s infinite;
}

/*----section2-----*/
.moumtain_line{
	background-image:url(../images/artshow/mountain_line.png);
	width: 497px;
    height: 172px;
    position: absolute;
    left: 5px;
    top: 5px;
}
.section2_bg{
	background-image:url(../images/artshow/section2bg.png);
	width: 634px;
    height: 383px;
    position: absolute;
    left: 5px;
    top: 88px;
}
.copy_button{
	background-image:url(../images/artshow/copy.png);
	width: 12px;
    height: 9px;
    position: absolute;
    z-index: 4;
    -webkit-animation:copy_button 1800ms linear 0s infinite;
    -moz-animation:copy_button 1800ms linear 0s infinite;
    -ms-animation:copy_button 1800ms linear 0s infinite;
    animation:copy_button 1800ms linear 0s infinite;
}
.copy3{
    left: 50px;
    top: 170px;
}
.copy4{
	left: 245px;
    top: 155px;
}
.copy5{
	left: 410px;
    top: 175px;
}
.copy6{
	left: 560px;
    top: 200px;
}
.pic3{
	background-image:url(../images/artshow/img_pic_3.png);
	width: 128px;
    height: 167px;
    position: absolute;
    left: 22px;
    top: 180px;
}
.pic4{
	background-image:url(../images/artshow/img_pic_4.png);
	width: 145px;
    height: 190px;
    position: absolute;
    left: 162px;
    top: 165px;
}
.pic5{
	background-image:url(../images/artshow/img_pic_5.png);
	width: 106px;
    height: 141px;
    position: absolute;
    left: 361px;
    top: 200px;
}
.pic6{
	background-image:url(../images/artshow/img_pic_6.png);
	width: 92px;
    height: 93px;
    position: absolute;
    left: 523px;
    top: 225px;
}

.section2_title{
	background-image:url(../images/artshow/section2_title.png);
	width: 177px;
    height: 42px;
    position: absolute;
    left: 410px;
    top: 38px;
}

.rotate_left_right{
	background-image:url(../images/artshow/rotate_left_right.png);
	width: 82px;
    height: 82px;
    position: absolute;
    left: 590px;
    top: 85px;
    -webkit-animation:rotate_left_right 3600ms linear 0s infinite;
    -moz-animation:rotate_left_right 3600ms linear 0s infinite;
    -ms-animation:rotate_left_right 3600ms linear 0s infinite;
    animation:rotate_left_right 3600ms linear 0s infinite;
}
.section2_geometry3{
	background-image:url(../images/artshow/section2_geometry3.png);
	width: 72px;
    height: 80px;
    position: absolute;
    left: 690px;
    top: 280px;
    -webkit-animation:home_sun 3600ms linear 0s infinite;
    -moz-animation:home_sun 3600ms linear 0s infinite;
    -ms-animation:home_sun 3600ms linear 0s infinite;
    animation:home_sun 3600ms linear 0s infinite;
}
.section2_geometry4{
	background-image:url(../images/artshow/section2_geometry4.png);
	width: 96px;
    height: 183px;
    position: absolute;
    left: 675px;
    top: 370px;
}
.section2_box1{
	background-image:url(../images/artshow/turn.png);
	width: 28px;
    height: 31px;
    position: absolute;
    left: 275px;
    top: 383px;
    -webkit-animation:home_sun 4800ms linear 0s infinite;
    -moz-animation:home_sun 4800ms linear 0s infinite;
    -ms-animation:home_sun 4800ms linear 0s infinite;
    animation:home_sun 4800ms linear 0s infinite;
}

@-webkit-keyframes rotate_left_right{
	0%{
		-webkit-transform:translateX(60px) rotate(-360deg);
	}
	50%{
		-webkit-transform:translateX(-20px) rotate(0deg);
	}
	100%{
		-webkit-transform:translateX(60px) rotate(360deg);
	}
}
@-moz-keyframes rotate_left_right{
	0%{
		-moz-transform:translateX(60px) rotate(-360deg);
	}
	50%{
		-moz-transform:translateX(-20px) rotate(0deg);
	}
	100%{
		-moz-transform:translateX(60px) rotate(360deg);
	}
}
@-ms-keyframes rotate_left_right{
	0%{
		-ms-transform:translateX(60px) rotate(-360deg);
	}
	50%{
		-ms-transform:translateX(-20px) rotate(0deg);
	}
	100%{
		-ms-transform:translateX(60px) rotate(360deg);
	}
}
@keyframes rotate_left_right{
	0%{
		transform:translateX(60px) rotate(-360deg);
	}
	50%{
		transform:translateX(-20px) rotate(0deg);
	}
	100%{
		transform:translateX(60px) rotate(360deg);
	}
}


/*=====section3====*/
.section3_bg{
	background-image:url(../images/artshow/section3bg.png);
	width: 1680px;
    height: 502px;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 3;
}
.section3_geometry1{
	background-image:url(../images/artshow/section3_geometry1.png);
	width: 263px;
    height: 192px;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1
}
.section3_geometry2{
	background-image:url(../images/artshow/section3_geometry2.png);
	width: 240px;
    height: 245px;
    position: absolute;
    left: 649px;
    top: 91px;
    z-index: 3;
}
.small_base{
	background-image:url(../images/artshow/small_base.png);
	width: 40px;
    height: 43px;
    position: absolute;
    left: 749px;
    top: 425px;
    z-index: 3;
}
.section3_line{
	background-image:url(../images/artshow/section3_line.png);
	width: 350px;
    height: 150px;
    position: absolute;
    left: 911px;
    top: -20px;
    z-index: 2;
    -webkit-animation:section3_line 7200ms linear 0s infinite;
    -moz-animation:section3_line 7200ms linear 0s infinite;
    -ms-animation:section3_line 7200ms linear 0s infinite;
    animation:section3_line 7200ms linear 0s infinite;
}
.section3_trans_base{
	background-image:url(../images/artshow/section3_trans_base.png);
	width: 23px;
    height: 24px;
    position: absolute;
    left: 990px;
    top: 350px;
    z-index: 3;
    -webkit-animation:key_repeat 7200ms linear 0s infinite;
    -moz-animation:key_repeat 7200ms linear 0s infinite;
    -ms-animation:key_repeat 7200ms linear 0s infinite;
    animation:key_repeat 7200ms linear 0s infinite;
}
.copy7{
	left: 100px;
	top: 150px;
}
.copy8{
	left: 410px;
	top: 140px;
}
.copy9{
	left: 555px;
	top: 150px;
}
.copy10{
	left: 950px;
	top: 160px;
}
.copy10_1{
	left: 1097px;
	top: 160px;
}
.copy11{
	left: 1225px;
	top: 140px;
}
.copy12{
	left: 1360px;
	top: 120px;
}
.copy13{
	left: 1550px;
	top: 135px;
}
.copy14{
	left: 1820px;
	top: 88px;
}
.pic7{
	background-image:url(../images/artshow/img_pic_7.png);
	width: 171px;
    height: 277px;
    position: absolute;
    left: 40px;
    top: 130px;
}
.pic8{
	background-image:url(../images/artshow/img_pic_8.png);
	width: 80px;
    height: 168px;
    position: absolute;
    left: 365px;
    top: 150px;
}
.section3_title3{
	background-image:url(../images/artshow/section3_title3.png);
	width: 172px;
    height: 42px;
    position: absolute;
    left: 430px;
    top: 50px;
    z-index: 3;
}
.section3_box1{
	background-image:url(../images/artshow/section3_box1.png);
	width: 20px;
    height: 19px;
    position: absolute;
    left: 370px;
    top: 35px;
    z-index: 3;
    -webkit-animation:clund_box 3600ms linear 0s infinite;
    -moz-animation:clund_box 3600ms linear 0s infinite;
    -ms-animation:clund_box 3600ms linear 0s infinite;
    animation:clund_box 3600ms linear 0s infinite;
}
.section3_box2{
	background-image:url(../images/artshow/section3_box2.png);
	width: 30px;
    height: 27px;
    position: absolute;
    left: 565px;
    top: 100px;
    z-index: 3;
	-webkit-animation:clund_box_back 3600ms linear 0s infinite;
	-moz-animation:clund_box_back 3600ms linear 0s infinite;
	-ms-animation:clund_box_back 3600ms linear 0s infinite;
	animation:clund_box_back 3600ms linear 0s infinite;
}
.section3_box3{
	background-image:url(../images/artshow/section3_box3.png);
	width: 32px;
    height: 32px;
    position: absolute;
    left: 610px;
    top: 10px;
    z-index: 3;
    -webkit-animation:clund_box 3600ms linear 0s infinite;
    -moz-animation:clund_box 3600ms linear 0s infinite;
    -ms-animation:clund_box 3600ms linear 0s infinite;
    animation:clund_box 3600ms linear 0s infinite;
}
.section3_box4{
	background-image:url(../images/artshow/section3_box4.png);
	width: 41px;
    height: 36px;
    position: absolute;
    left: 660px;
    top: 55px;
    z-index: 3;
    -webkit-animation:clund_box_back 3600ms linear 0s infinite;
    -moz-animation:clund_box_back 3600ms linear 0s infinite;
    -ms-animation:clund_box_back 3600ms linear 0s infinite;
    animation:clund_box_back 3600ms linear 0s infinite;
}
.section3_box5{
	background-image:url(../images/artshow/section3_box5.png);
	width: 30px;
    height: 29px;
    position: absolute;
    left: 530px;
    top: 350px;
    z-index: 3;
    -webkit-animation:home_sun1 3000ms linear 0s infinite;
    -moz-animation:home_sun1 3000ms linear 0s infinite;
    -ms-animation:home_sun1 3000ms linear 0s infinite;
    animation:home_sun1 3000ms linear 0s infinite;
}
.pic9{
	background-image:url(../images/artshow/img_pic_9.png);
	width: 121px;
    height: 177px;
    position: absolute;
    left: 502px;
	top: 170px;
}
.section3_trans{
	background-image:url(../images/artshow/section3_trans.png);
	width: 64px;
    height: 64px;
    position: absolute;
    left: 737px;
    top: 143px;
    z-index: 5;
    -webkit-animation:home_sun1 2000ms linear 0s infinite;
    -moz-animation:home_sun1 2000ms linear 0s infinite;
    -ms-animation:home_sun1 2000ms linear 0s infinite;
    animation:home_sun1 2000ms linear 0s infinite;

}
.trans_base{
	background-image:url(../images/artshow/trans_base.png);
	width: 126px;
    height: 134px;
    position: absolute;
    left: 706px;
    top: 286px;
    z-index: 5;
}

.pic10{
	background-image:url(../images/artshow/img_pic_10.png);
	width: 92px;
    height: 114px;
    position: absolute;
    left: 910px;
	top: 180px;
}
.pic11{
	background-image:url(../images/artshow/img_pic_11.png);
	width: 134px;
    height: 114px;
    position: absolute;
    left: 1035px;
	top: 180px;
}
.pic12{
	background-image:url(../images/artshow/img_pic_12.png);
	width: 122px;
    height: 230px;
    position: absolute;
    left: 1197px;
	top: 135px;
}
.global_title{
	background-image:url(../images/artshow/global_title.png);
	width: 144px;
    height: 44px;
    position: absolute;
    left: 1360px;
	top: 30px;
	z-index: 5;
}
.pic13{
	background-image:url(../images/artshow/img_pic_13.png);
	width: 122px;
    height: 203px;
    position: absolute;
    left: 1300px;
	top: 140px;
}
.pic14{
	background-image:url(../images/artshow/img_pic_14.png);
	width: 168px;
    height: 144px;
    position: absolute;
    left: 1470px;
	top: 170px;
}
.section3_art{
	background-image:url(../images/artshow/art.png);
	width: 120px;
    height: 133px;
    position: absolute;
    left: 1593px;
	top: 5px;
	z-index: 1;
}
.section3_ball2{
	background-image:url(../images/artshow/section3_ball2.png);
	width: 177px;
    height: 218px;
    position: absolute;
    left: 1750px;
	top: 110px;
	-webkit-animation:home_light 3600ms linear 0s infinite;
	-moz-animation:home_light 3600ms linear 0s infinite;
	-ms-animation:home_light 3600ms linear 0s infinite;
	animation:home_light 3600ms linear 0s infinite;
}
.art_title{
	width: 24px;
    height: 89px;
    position: absolute;
    border: 1px solid #fff;
    left: 1899px;
	top: 117px;
	padding-top: 8px;
	text-align: center;
	color: #fff; 
}
.art_border{
	width: 24px;
    height: 89px;
    position: absolute;
    border: 1px solid #fff;
    left: 1895px;
	top: 120px;
}
.art_base{
	background-image:url(../images/artshow/art_base.png);
	width: 167px;
    height: 142px;
    position: absolute;
    left: 1759px;
	top: 320px;}

	/*section3动画*/
@-webkit-keyframes clund_box{
	0%{
		-webkit-transform:translateX(160px) rotate(360deg);
	}
	50%{
		-webkit-transform:translateX(0) rotate(0);
	}
	100%{
		-webkit-transform:translateX(160px) rotate(360deg);
	}
}
@-moz-keyframes clund_box{
	0%{
		-moz-transform:translateX(160px) rotate(360deg);
	}
	50%{
		-moz-transform:translateX(0) rotate(0);
	}
	100%{
		-moz-transform:translateX(160px) rotate(360deg);
	}
}
@-ms-keyframes clund_box{
	0%{
		-ms-transform:translateX(160px) rotate(360deg);
	}
	50%{
		-ms-transform:translateX(0) rotate(0);
	}
	100%{
		-ms-transform:translateX(160px) rotate(360deg);
	}
}
@keyframes clund_box{
	0%{
		transform:translateX(160px) rotate(360deg);
	}
	50%{
		transform:translateX(0) rotate(0);
	}
	100%{
		transform:translateX(160px) rotate(360deg);
	}
}

@-webkit-keyframes clund_box_back{
	0%{
		-webkit-transform:translateX(-160px) rotate(-360deg);
	}
	50%{
		-webkit-transform:translateX(0) rotate(0);
	}
	100%{
		-webkit-transform:translateX(-160px) rotate(-360deg);
	}
}
@-moz-keyframes clund_box_back{
	0%{
		-moz-transform:translateX(-160px) rotate(-360deg);
	}
	50%{
		-moz-transform:translateX(0) rotate(0);
	}
	100%{
		-moz-transform:translateX(-160px) rotate(-360deg);
	}
}
@-ms-keyframes clund_box_back{
	0%{
		-ms-transform:translateX(-160px) rotate(-360deg);
	}
	50%{
		-ms-transform:translateX(0) rotate(0);
	}
	100%{
		-ms-transform:translateX(-160px) rotate(-360deg);
	}
}
@keyframes clund_box_back{
	0%{
		transform:translateX(-160px) rotate(-360deg);
	}
	50%{
		transform:translateX(0) rotate(0);
	}
	100%{
		transform:translateX(-160px) rotate(-360deg);
	}
}

@-webkit-keyframes key_repeat{
	0%{
		-webkit-transform:scaleX(1);
	}
	50%{
		-webkit-transform:scaleX(-1);
	}
	100%{
		-webkit-transform:scaleX(1);
	}
}
@-moz-keyframes key_repeat{
	0%{
		-moz-transform:scaleX(1);
	}
	50%{
		-moz-transform:scaleX(-1);
	}
	100%{
		-moz-transform:scaleX(1);
	}
}

@-ms-keyframes key_repeat{
	0%{
		-ms-transform:scaleX(1);
	}
	50%{
		-ms-transform:scaleX(-1);
	}
	100%{
		-ms-transform:scaleX(1);
	}
}
@keyframes key_repeat{
	0%{
		transform:scaleX(1);
	}
	50%{
		transform:scaleX(-1);
	}
	100%{
		transform:scaleX(1);
	}
}

@-webkit-keyframes section3_line{
	0%{
		-webkit-transform:translateY(20px);
	}
	50%{
		-webkit-transform:translateY(0);
	}
	100%{
		-webkit-transform:translateY(20px);
	}
}
@-moz-keyframes section3_line{
	0%{
		-moz-transform:translateY(20px);
	}
	50%{
		-moz-transform:translateY(0);
	}
	100%{
		-moz-transform:translateY(20px);
	}
}
@-ms-keyframes section3_line{
	0%{
		-ms-transform:translateY(20px);
	}
	50%{
		-ms-transform:translateY(0);
	}
	100%{
		-ms-transform:translateY(20px);
	}
}
@keyframes section3_line{
	0%{
		transform:translateY(20px);
	}
	50%{
		transform:translateY(0);
	}
	100%{
		transform:translateY(20px);
	}
}


/*----audio部分-----*/
.show_audio{
	display: none;
	width: 100%;
	height: 100%;
	position:absolute;
	left:0;
	top:0;
	z-index: 10;
	overflow: hidden;
    background-color: rgba(0, 0, 0, .73);
}

.closeico{
	position:absolute;
	left:15px;
	top:25px;
	width: 30px;
	height: 30px;
	color: #fff;
	font-size: 25px;
	line-height: 25px;
	text-align: center;
	border: 1px solid #fff;
	border-radius: 50%;
}

.audio_pic{
	margin: 10px 35px 10px 35px;
    text-align: center;
    height: 195px;
}

.audio_pic>img{
    max-width: 100%;
    max-height: 100%;
}

.pic_audio{
    text-align: center;
}

.play_audio{
	display: inline-block;
    background-color: #f6f6f6;
    border-radius: 8px;
    height: 29px;
    padding: 2px 8px;
}

.play_audio .play{
	background-image:url(../images/audio/ico_play.png);
	display: inline-block;
	width: 20px;
	height: 20px;
	vertical-align: middle;
}

.play_audio .pause{
	background-image:url(../images/audio/ico_pause.png);
	width: 20px;
	height: 20px;
    vertical-align: middle;
    display: none;
}

.audio_line{
	background-image:url(../images/audio/audio.png);
	width: 80px;
    height: 23px;
    display: inline-block;
    vertical-align: middle;
}

.audio_time{
	display: inline-block;
    vertical-align: middle;
    color: #000;
    font-size: 14px;
}

.audio_title{
	margin-top: 10px;
	text-align: center;
	color: #fff;
}

.audio_detail{
	margin:5px 5px;
	line-height: 1.2;
	text-indent: 2em;
	letter-spacing: 2px;
	color: #fff;
}

.more_detail_box{
	width: 100%;
}

.audio_more{
	margin: 10px 40px;
	height: 35px;
	line-height: 35px;
	text-align: center;
	letter-spacing: 2px;
	color: #000;
	font-size: 16px;
	font-weight: bold;
}

.detail{
	background: #fff; 
}


.audio_buy{
	background: #f06f6f; 
}



